<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title><?php echo ($title); ?></title>
<link rel="stylesheet" href="http://www.shop.cn/Public/css/base.css" type="text/css"/>
<link rel="stylesheet" href="http://www.shop.cn/Public/css/global.css" type="text/css"/>
<link rel="stylesheet" href="http://www.shop.cn/Public/css/header.css" type="text/css"/>
<link rel="stylesheet" href="http://www.shop.cn/Public/css/login.css" type="text/css"/>
<link rel="stylesheet" href="http://www.shop.cn/Public/css/footer.css" type="text/css"/>

</head>
<body>
<!-- 顶部导航 start -->
<div class="topnav">
<div class="topnav_bd w990 bc">
    <div class="topnav_left">

    </div>
    <div class="topnav_right fr">
        <ul>
            <li>您好，欢迎来到京西！[<a href="<?php echo U('Member/login');?>">登录</a>] [<a href="<?php echo U('Member/register');?>">免费注册</a>] </li>
            <li class="line">|</li>
            <li>我的订单</li>
            <li class="line">|</li>
            <li>客户服务</li>

        </ul>
    </div>
</div>
</div>
<!-- 顶部导航 end -->

<div style="clear:both;"></div>

<!-- 页面头部 start -->
<div class="header w990 bc mt15">
<div class="logo w990">
    <h2 class="fl"><a href="<?php echo U('Index/index');?>"><img src="http://www.shop.cn/Public/images/logo.png" alt="京西商城"></a></h2>
</div>
</div>
<!-- 页面头部 end -->


    <div class="login w990 bc mt10 regist">
        <div class="login_hd">
            <h2>用户注册</h2>
            <b></b>
        </div>
        <div class="login_bd">
            <div class="login_form fl">
                <form action="<?php echo U();?>" method="post" id="reg">
                    <ul>
                        <li>
                            <label>用户名：</label>
                            <input type="text" class="txt" name="username"/><span class="error-msg"></span>

                            <p>3-20位字符，可由中文、字母、数字和下划线组成</p>
                        </li>
                        <li>
                            <label>密码：</label>
                            <input type="password" class="txt" name="password" id="password"/><span
                                class="error-msg"></span>

                            <p>6-20位字符，可使用字母、数字和符号的组合，不建议使用纯数字、纯字母、纯符号</p>
                        </li>
                        <li>
                            <label>确认密码：</label>
                            <input type="password" class="txt" name="repassword"/><span class="error-msg"></span>

                            <p><span>请再次输入密码</p>
                        </li>
                        <li>
                            <label>邮箱：</label>
                            <input type="text" class="txt" name="email"/><span class="error-msg"></span>

                            <p>邮箱必须合法</p>
                        </li>
                        <li>
                            <label>手机号码：</label>
                            <input type="text" class="txt" value="" name="tel" id="tel" placeholder=""/><span
                                class="error-msg"></span>
                        </li>
                        <li>
                            <label>短信验证：</label>
                            <input type="text" class="txt" value="" placeholder="请输入短信验证码" name="sms"
                                   disabled="disabled" id="captcha"/> <input type="button" onclick="bindPhoneNum(this)"
                                                                             id="get_captcha" value="获取验证码"
                                                                             style="height: 25px;padding:3px 8px"/><span
                                class="error-msg"></span>

                        </li>
                        <li class="checkcode">
                            <label>验证码：</label>
                            <input type="text" name="checkcode"/>
                            <img id="checkcode" src="<?php echo U('Captcha/code');?>" title="点击换图" onclick='this.src="<?php echo U('Captcha/code');?>"'/><span
                                class="error-msg"></span>
                        </li>

                        <li>
                            <label>&nbsp;</label>
                            <input type="checkbox" name="agree" class="chb"/> 我已阅读并同意《用户注册协议》<span
                                class="error-msg"></span>
                        </li>
                        <li>
                            <label>&nbsp;</label>
                            <input type="submit" value="" class="login_btn"/>
                        </li>
                    </ul>
                </form>


            </div>

            <div class="mobile fl">
                <h3>手机快速注册</h3>

                <p>中国大陆手机用户，编辑短信 “<strong>XX</strong>”发送到：</p>

                <p><strong>1069099988</strong></p>
            </div>

        </div>
    </div>
    <!-- 登录主体部分end -->




<div style="clear:both;"></div>
<!-- 底部版权 start -->
<div class="footer w1210 bc mt15">
<p class="links">
    <a href="">关于我们</a> |
    <a href="">联系我们</a> |
    <a href="">人才招聘</a> |
    <a href="">商家入驻</a> |
    <a href="">千寻网</a> |
    <a href="">奢侈品网</a> |
    <a href="">广告服务</a> |
    <a href="">移动终端</a> |
    <a href="">友情链接</a> |
    <a href="">销售联盟</a> |
    <a href="">京西论坛</a>
</p>
<p class="copyright">
    © 2005-2013 京东网上商城 版权所有，并保留所有权利。  ICP备案证书号:京ICP证070359号
</p>
</div>
<!-- 底部版权 end -->
<script type="text/javascript" src="http://www.shop.cn/Public/js/jquery.min.js"></script>

    <script type="text/javascript" src="http://www.shop.cn/Public/js/jquery.validate.min.js"></script>
    <script type="text/javascript" src="http://www.shop.cn/Public/plugs/layer/layer.js"></script>
    <script type="text/javascript">
        //初始化验证规则
        $('#reg').validate({
            rules: {
                //验证用户名
                username: {
                    required: true,
                    rangelength: [3, 20],
                    remote: '<?php echo U("verifyParam");?>',//ajax请求地址,验证用户名是否被注册
                },
                //验证密码
                password: {
                    required: true,
                    rangelength: [6, 20],
                },
                //验证二次输入的密码
                repassword: {
                    required: true,
                    equalTo: '#password',   //id选择器
                },
                //验证email是否合法
                email: {
                    required: true,
                    email: true,
                    remote: '<?php echo U("verifyParam");?>',//ajax请求地址,验证邮箱是否被占用
                },
                //验证电话号码是否合法
                tel: {
                    required: true,
                    mobileNumber: true,
                    remote: '<?php echo U("verifyParam");?>',//ajax请求地址
                },
                captcha: "required",
                checkcode: "required",
                agree: "required",
            },

            //验证提示信息
            messages: {
                username: {
                    required: "用户名不能为空",
                    rangelength: "用户名长度应是3-20位",
                    remote: "用户名已存在",
                },
                password: {
                    required: "密码不能为空",
                    rangelength: "密码长度应是6-20位",
                },
                repassword: {
                    required: "请再次输入您的密码",
                    equalTo: "两次密码不一致",
                },
                email: {
                    required: "邮箱不能为空",
                    email: "邮箱不合法",
                    remote: "邮箱已被注册",
                },
                tel: {
                    required: "手机号码不能为空",
                    remote: "手机号码已被注册",
                },
                captcha: "验证码不能为空",
                checkcode: "验证码不能为空",
                agree: "必须同意许可协议",
            },

            //将错误信息放入指定位置
            errorPlacement: function (error, element) {
                var errMsg = error[0].innerHTML;
                var place = $(element).siblings('.error-msg');
                //输出错误信息
                place.html(errMsg)
            },
            //成功后执行的函数
            success: function () {},
        });

        //自定义验证规则
        $.validator.addMethod("mobileNumber", function (tel) {

            return /^1[34578]\d{9}$/.test(tel);

        }, "请正确填写11位手机号码");

        //发送验证码时间
        function bindPhoneNum() {
            //启用输入框
            $('#captcha').prop('disabled', false);

            //发送验证码
            var url = '<?php echo U("sendSms");?>';
            var data = {tel: $('#tel').val()};
            $.getJSON(url, data, function (data) {
                console.debug(data);
                if(data.status == true){
                    layer.alert(data.msg, {icon: 6});
                }

                if(data.status == false){
                    layer.alert(data.msg, {icon: 5});
                }
            });

            var time = 60;
            var interval = setInterval(function () {
                time--;
                if (time <= 0) {
                    clearInterval(interval);
                    var html = '获取验证码';
                    $('#get_captcha').prop('disabled', false);
                } else {
                    var html = time + ' 秒后再次获取';
                    $('#get_captcha').prop('disabled', true);
                }

                $('#get_captcha').val(html);
            }, 1000);
        }
    </script>

</body>
</html>